body{
  
    /* margin-bottom: 300px; */
}

/* head */
.haed{
    border-bottom: 1px solid rgb(228, 228, 235);
    position: static;
    /* background-color: #f1f1f1; */

    /* margin-bottom: 50px; */
}
.nav li a{
   color: #666;
  }  
  .hdenglu{
    color: #666;
}
.canvas{
   position: relative;
   z-index: 10;
   height: 400px;
  

}
canvas {
    /* background-color: #ccc; */
    position: absolute !important;
    z-index: -1 !important;
   background-color: #f1f1f1;
    width: 100%;
    height: 400px;
  }
  .dbox{
    
      display: flex;
      justify-content: space-around;
    height: 400px;
      background-color: rgba(234, 244, 248, 0.185);
  }
  .dbox .picimg{
    padding-top: 60px !important;
    box-sizing: border-box;
      text-align: center;
   background: rgba(255, 255, 255, .5 );
      width: 300px;
      height: 300px;
  }
   .dbox .pictext{
     position: relative;
       margin-right: 130px;
    width: 700px;
    height: 300px;
   }
  .divimg{
    margin-top: 30px;
    letter-spacing: 58px;
  }
  .divnum{
    margin-top: 15px;
  }
  .divnum .right{
    margin-right: 39px;
  }
  .divnum .right1{
    margin-right: 43px;
  }
  .pictext h1{
    margin-bottom: 10px;
    display: inline-block;
    font-size: 30px;
    color: #666;
    font-weight: 700;
  }
  .pictext .http{
    color: slateblue;
    padding:2 px 5px;
    margin-left: 10px;
    border: 1px solid  slateblue;
  }

  .pictext .r{
    margin-left: 25px;
  }
  .pictext a{
    color: #f8aa39;
  }
  .pictext .jianche{
    margin-bottom: 10px ;
  }

  .price-ul{
    display: flex;
    margin-bottom: 5px;
  }
  .price-ul li {
    font-size: 12px;
    height: 28px;
    padding:0px 12px;
    line-height: 26px;
    border:1px solid #999;
    color: #666;
    margin-right: 14px;
    box-sizing: border-box;
    cursor: pointer;
  }
  .prcode-box img{
      margin-top: 5px;
    top: 130px;
    width: 80px;
    height: 80px;
  }
  .prcode-box p{
    text-align: center;
  }
  .prcode-box{
    opacity: 0;
    position: absolute;
    transition: .5s;
   
  }
  .pricebtn{
    margin-top: 20px;
    padding: 10px 30px;
    background: slateblue;
    border: none;
    color: #fff;
  }
  .price-ul .prcode{
    border: 1px solid #00bdf0;
  }
  

  .price-ul li.active{
    background: url("../imgs/select.png") no-repeat right bottom;
    border-color: #00bdff;
    color: #00bdff;
  }
  
  .price-ul .prcodex {
    position: relative;
    border-color: #00bdff;
    color: #00bdff;
  }
  .price-ul .prcode:hover .prcode-box{
    opacity: 1;
   
  }
  .price-ul .prcode-box div{
  height: 0;
  text-align: center;
  left: 50%;
  top: 35px;
  transform: translateX(-50%);
  color: #666;
  overflow: hidden;
  transition: all 1s;
 
  }
  

  /* 版心 */
  .documentbox{
    display: flex;
    
  }

  .tabbox .navbox{
    height: 50px;
    /* background: skyblue; */
    border-bottom: 1px solid #ccc;
  }
  .navbox{
    cursor: pointer;
    line-height: 50px;
    display: flex;
    justify-content: space-around ;
  }

  .documentbox .tabbox .navbox li{
    position: relative;
  }

  .documentbox .tabbox .navbox li.active{
    color: #00bdff;
  }
  .documentbox .tabbox .navbox li.active::before{
    content: "";
    position: absolute;
    bottom: 0px;
    left: 0px;
    width: 100%;
    height: 3px;
    background-color: #00bdff;
  }
  /* api文档 */
/* .new{display: none;} */
.new-2{display: none;}
.new-1{border-bottom: 1px solid #c9c9c9;}
.apiwd{display: none;}
.new-1 li{float: left; font-size: 16px;margin-right: 110px;height: 50px; cursor: pointer;}
.new-1 .active{border-bottom: 3px solid #2dc7fd;color: #2dc7fd;}
.apiwd .apiwd-1{line-height: 30px;}
.apiwd .jiachu{font-weight: bold;}
.apiwd .btn{width: 150px;height: 35px;background-color: #2dc7fd;color: #fff
    ;border: none;line-height: 35px;margin-top: 15px;margin-bottom: 30px;}
    .apiwd h2{text-indent: 1em;font-weight: bold;position: relative; margin-top: 20px;}
    .apiwd h2::before{width: 3px;height: 15px;background-color: #2dc7fd;content: '';display: inline-block; position: absolute;left: 4px;top: 3px;}
    table{border: 1px solid #e7e7e7;width: 700px;height: 170px;margin-top: 15px;border-collapse: collapse;margin-bottom: 50px; }
    tr{border: 1px solid #e7e7e7 !important;height: 34px;}
    tr td{text-indent: 3em;}
    table .color1{background-color: #f4f4f4;}
    table .color2{background-color: #f4f4f4;}.apiwd .btn-5{background-color: royalblue;padding:9px 9px;border-radius: 8px;color: #fff;}.json-code{margin-top: 30px; width: 800px;height:200px;background-color: #f4f4f4; }.json-code .tindent10{line-height: 20px;margin-left: 15px;} 


    .activ{
      width: 100%;
      height: 300px;
      margin-top: 80px;
    }
    .activ img{
      margin-bottom: 10px;
    }
    .tivity{
      font-size: 18px;
      margin-bottom: 10px;
    }


    .lock{
      width: 100%;
      height: 500px;
      margin-top: 20px;
    }


    /* 猜你喜欢 */
    /* .recommend{

    } */


.recommend li{
  display: flex;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px dashed #eee;
}
.recommend li:last-child{
  border-bottom:0px;
}
.recommend li .imgbox{
  width: 58px;
  height: 40px;
  padding-top: 18px;
  text-align: center; 
  margin-right: 20px;
  
  border: 1px solid #eee;
}
.recommend li .title a{
  color: #555;
  font-size: 16px;
  line-height: 26px;

}
.recommend li .desc{
  width: 150px;
  line-height: 22px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #999;
  
}
.recommend li .desc span{
  font-size: 12px;
  color: #999;
}
  
.apicode{
  display: block;
}
.rightbox3{
  margin-left: 20px;
}
/* 广告服务 */
.banner-2{background: #1271ef url(../imgs/login-register-bg.svg); text-align: center;}
.banner-2 h1{font-size: 35px;color: #fff;padding-top: 90px;}
.banner-2 a{color: #fff; display: inline-block;border: 1px solid #fff;padding: 15px 40px;margin-top: 20px;}


/* w尾部 */
.foot-2{background-color: #daffff;}
.foot li{width: 100px; height: 200px;padding-left: 40px;margin-top: 50px;}
.foot-1 .size{font-size: 14px;font-weight: bold !important;margin-bottom: 30px;}
.foot-1 p{line-height: 25px;color: #b3b3b3;}
.wechat {margin-left: 200px;margin-top: 100px;position: relative;width: 230px;}
.wechat .weixin{bottom: 145px;left: 40px;position: absolute;}
.wechat .ymsd{position: absolute;bottom: 123px; left: 59px;}
.wechat .fontwb{color: #b3b3b3;position: absolute;top: 130px;left: -130px;}
.bei{ margin-top: 20px;margin-left: 100px;color: #b3b3b3}
.bei .bei-img{margin-right: 7px;}

.red{
  color: red;
}